import { Container, Tab, Tabs } from 'native-base';// 标签选项卡
import React from 'react';
import { ActivityIndicator, FlatList, Image, RefreshControl, Text, TouchableOpacity, View } from 'react-native';
import { Icon } from 'react-native-elements';
import { NavigationEvents } from 'react-navigation';
// {(() => { debugger })()}
interface D {
	headimg: {};  // 学生头像
	phone: string; //  学生家长电话
	sex: string; // 学生性别
	student_name: string; // 学生姓名
	student_no: string; // 学生编号
	whether_enter_face: string; // 是否录入人脸
	class_name: string; // 班级名称
	class_id: string; // 班级编号
	sign_back: number; // 是否已签退
	parent_number: string; // 家长编号
	parent_name: string; // 家长名称
}
export default function tpl(a: <T>(action: string, ...args: unknown[]) => ((...args: unknown[]) => void), s: (...class_names: string[]) => {}, d: (d: string) => string | unknown[] | number) {
	const tba = d('t') as number; // 本次查询多少条
	const wqd = d('wqd') as [D]; // 未签到
	const yqd = d('yqd') as [D]; // 已签到
	const qj = d('qj') as [D]; // 请假
	if (wqd) {
		return (
			<View style={{ height: '100%', backgroundColor: '#f4f4f4' }}>
				<NavigationEvents
					onWillFocus={a('a001')}
				/>
				<View style={{ flexDirection: 'row' }}>
					<Container>
						{/* <Header hasTabs /> */}
						<Tabs onChangeTab={a('a002')}>
							<Tab heading="未签到">
								{(() => {
									if (!wqd) { // undefined
										return (<View style={s('footer1')}>
											<ActivityIndicator
												animating={true}
												color='blue'
												size="large"
											/>
										</View>);
									} else if (wqd.length > 0) { // 有数据
										const totle = wqd.length;
										return (<View>
											<FlatList
												refreshControl={
													<RefreshControl
														onRefresh={a('a003')}
														colors={['#ff0000']}
														enabled={true}
														progressBackgroundColor="#ffffff"
														refreshing={false}
													/>
												}
												onEndReached={wqd.length > 19 ? a('a004') : a('')} onEndReachedThreshold={0.1}
												data={wqd} renderItem={({ item, index }) => <View>
													<View style={s('list1')}>
														<View style={s('rowC')}>
															<Image source={item.headimg ? item.headimg : item.sex === '0' ? require('../../imgs/nan.jpg') : require('../../imgs/nv.jpg')} style={s('tu1')} />
															<Text style={s('text1')}>{item.student_name}</Text>
															<Text style={s('text2')}>{item.class_name}</Text>
														</View>
														<View style={s('rowC')}>
															{(() => {
																if (item.whether_enter_face !== '0') {
																	return (<View style={s('rowC')}>
																		<TouchableOpacity onPress={a('a005', item.class_id, item.student_no)}>

																			<View style={s('icon1', 'border1e')}>

																				<View style={s('btn2')}>
																					<Text style={{ color: '#fff', fontSize: 12, textAlign: 'center', lineHeight: 25 }}>签到</Text>																			</View>


																			</View>
																		</TouchableOpacity>
																		<TouchableOpacity onPress={a('a006', item.phone)}>
																			<View style={s('icon')}>
																				<Icon name="call" color="#fff" size={20}></Icon>
																			</View>
																		</TouchableOpacity>
																	</View>);
																} else {
																	return (
																		<TouchableOpacity onPress={a('a007', item)}>
																			<View style={s('rowC')}>
																				<Text style={s('btn1')}>人脸录入</Text>
																			</View>
																		</TouchableOpacity>);
																}
															})()}


														</View>
													</View>
													{(() => {
														if (totle === index + 1 && totle > 19) {
															if (tba > 0 && totle > 19) {
																return (
																	<View style={s('footer')}>
																		<ActivityIndicator />
																		<Text>正在加载更多数据...</Text>
																	</View>
																);
															} else if (tba === 0) {
																return (
																	<View style={{ height: 50, alignItems: 'center', justifyContent: 'flex-start' }}>
																		<Text style={{ color: '#999999', fontSize: 14, marginTop: 5, marginBottom: 5 }}>
																			没有更多数据了
																			</Text>
																	</View>
																);
															}
														}
													})()}
												</View>
												} />
										</View>);
									} else { // 无数据
										return (<View style={s('page')}>
											<Image source={require('../../imgs/wushuju.png')} style={{ width: 80, height: 80 }} />
											<Text style={{ fontSize: 20 }}>没有符合当前筛选条件的数据</Text>
										</View>);
									}
								})()}
							</Tab>
							<Tab heading="已签到">
								{(() => {
									if (!yqd) { // undefined
										return (<View style={s('footer1')}>
											<ActivityIndicator
												animating={true}
												color='blue'
												size="large"
											/>
										</View>);
									} else if (yqd.length > 0) { // 有数据
										const totle = yqd.length;
										return (<View>
											<FlatList
												refreshControl={
													<RefreshControl
														onRefresh={a('a003')}
														colors={['#ff0000']}
														enabled={true}
														progressBackgroundColor="#ffffff"
														refreshing={false}
													/>
												}
												onEndReached={yqd.length > 19 ? a('a004') : a('')} onEndReachedThreshold={0.1}
												data={yqd} renderItem={({ item, index }) =>
													<View>
														<View style={s('list1')}>
															<View style={s('rowC')}>
																<Image source={item.headimg ? item.headimg : item.sex === '0' ? require('../../imgs/nan.jpg') : require('../../imgs/nv.jpg')} style={s('tu1')} />
																<Text style={s('text1')}>{item.student_name}</Text>
																<Text style={s('text2')}>{item.class_name}</Text>
															</View>
															<View style={s('rowC')}>
																{(() => {
																	return (<View style={s('rowC')}>
																		{(() => {
																			if (item.sign_back) {
																				return (<TouchableOpacity onPress={a('a008', item)}>

																					<View style={s('icon1', 'border1e')}>
																						<Text style={s('btn2')}>签退</Text>
																					</View>
																				</TouchableOpacity>);
																			}
																		})()}

																		<TouchableOpacity onPress={a('a006', item.phone)}>
																			<View style={s('icon')}>
																				<Icon name="call" color="#ffffff" size={20}></Icon>
																			</View>
																		</TouchableOpacity>
																	</View>);

																})()}


															</View>
														</View>
														{(() => {
															if (totle === index + 1 && totle > 19) {
																if (tba > 0 && totle > 19) {
																	return (
																		<View style={s('footer')}>
																			<ActivityIndicator />
																			<Text>正在加载更多数据...</Text>
																		</View>
																	);
																} else if (tba === 0) {
																	return (
																		<View style={{ height: 50, alignItems: 'center', justifyContent: 'flex-start' }}>
																			<Text style={{ color: '#999999', fontSize: 14, marginTop: 5, marginBottom: 5 }}>
																				没有更多数据了
																				</Text>
																		</View>
																	);
																}
															}
														})()}
													</View>
												} />
										</View>);
									} else { // 无数据
										return (<View style={s('page')}>
											<Image source={require('../../imgs/wushuju.png')} style={{ width: 80, height: 80 }} />
											<Text style={{ fontSize: 20 }}>没有符合当前筛选条件的数据</Text>
										</View>);
									}
								})()}
							</Tab>
							<Tab heading="已请假">
								{(() => {
									if (!qj) { // undefined
										return (<View style={s('footer1')}>
											<ActivityIndicator
												animating={true}
												color='blue'
												size="large"
											/>
										</View>);
									} else if (qj.length > 0) { // 有数据
										const totle = qj.length;
										return (<View>
											<FlatList refreshControl={
												<RefreshControl
													onRefresh={a('a003')}
													colors={['#ff0000']}
													enabled={true}
													progressBackgroundColor="#ffffff"
													refreshing={false}
												/>
											}
												onEndReached={qj.length > 19 ? a('a004') : a('')} onEndReachedThreshold={0.1} data={qj} renderItem={({ item, index }) =>
													<View>
														<View style={s('list1')}>
															<View style={s('rowC')}>
																<Image source={item.headimg ? item.headimg : item.sex === '0' ? require('../../imgs/nan.jpg') : require('../../imgs/nv.jpg')} style={s('tu1')} />
																<Text style={s('text1')}>{item.student_name}</Text>
																<Text style={s('text2')}>{item.class_name}</Text>
															</View>
															<View style={s('rowC')}>
																<TouchableOpacity onPress={a('a006', item.phone)}>
																	<View style={s('icon')}>
																		<Icon name="call" color="#ffffff" size={20}></Icon>
																	</View>
																</TouchableOpacity>
															</View>
														</View>
														{(() => {
															if (totle === index + 1 && totle > 19) {
																if (tba > 0 && totle > 19) {
																	return (
																		<View style={s('footer')}>
																			<ActivityIndicator />
																			<Text>正在加载更多数据...</Text>
																		</View>
																	);
																} else if (tba === 0) {
																	return (
																		<View style={{ height: 50, alignItems: 'center', justifyContent: 'flex-start' }}>
																			<Text style={{ color: '#999999', fontSize: 14, marginTop: 5, marginBottom: 5 }}>
																				没有更多数据了
								</Text>
																		</View>
																	);
																}
															}
														})()}
													</View>
												} />
										</View>);
									} else { // 无数据
										return (<View style={s('page')}>
											<Image source={require('../../imgs/wushuju.png')} style={{ width: 80, height: 80 }} />
											<Text style={{ fontSize: 20 }}>没有符合当前筛选条件的数据</Text>
										</View>);
									}
								})()}
							</Tab>
						</Tabs>
					</Container>
				</View>
			</View>
		);

	} else {
		return (
			<View style={s('footer1')}>
				<ActivityIndicator
					animating={true}
					color='blue'
					size="large"
				/>
			</View>
		);
	}
}
